<template>
  <div class="w-full min-h-[100vh] bg-[#F2F4F5]">
    <div class=" overflow-hidden max-w-[1440px]" style="margin: 0 auto">
      <div
        v-for="item in noticeList"
        @click="pushDetail(item.id)"
        class="bg-white w-full p-[30px] rounded-[10px] mt-[20px] cursor-pointer"
      >
        <div class="" style="font-size: 20px">{{ item.title }}</div>
        <div class="text-[#DDDDDD] mt-[20px]" style="font-size: 16px">
          {{ item.create_time }}
        </div>
      </div>
      <div class="mt-[20px]">
        <el-pagination
          background
          layout="prev, pager, next"
          :total="total"
          :current-page="currnetPage"
          @current-change="currentChange"
        />
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import { indexGetNotice } from "@/utils/api";
import { useRouter } from "vue-router";
import { ref } from "vue";
const router = useRouter();
const noticeList = ref<noticeType[]>([]);
const currnetPage = ref(1);
const total = ref(0);
const page = ref(1);
//获取公告数据
const getNoticeList = async () => {
  const res = await indexGetNotice({ page: page.value });
  noticeList.value = res.msg.data;
  total.value = res.msg.total;
  currnetPage.value = res.msg.current_page;
  // console.log(res.msg);
};
const getData = () => {
  getNoticeList();
};
getData();
//翻页
const currentChange = (v: number) => {
  page.value = v;
  getNoticeList();
};
const pushDetail = (id: number) => {
  router.push("/index/noticeDetail?id=" + id);
};
</script>
